import React, {useState} from 'react';
function TodoList(){
    const [inputValue, setinputValue] = useState("");
    const [lists, submitClick] = useState([]);
    const testsub =()=>{
      setinputValue("");
      submitClick([ inputValue,...lists])
    };
    const liClick = function (e) {
        lists.splice(e,1);
      submitClick([...lists])
    };
  return (
    <div className="App">
        <input
            value={inputValue}
            onChange={(e)=>setinputValue(e.target.value)} />
        <button onClick={testsub}>提交</button>
      <ul>
          {lists.map((item,index)=>
              <li key={index}>{item}<button onClick={(e)=>liClick(index)}>x</button></li>
          )}
      </ul>
    </div>
  );
}
export default TodoList;